<div class="innerbanner">
    <img src="/static/v1/picture/con_banner.jpg" alt="">
    <div class="text icenter3">
        <h3 aos="fade-up">关于我们</h3>
        <h4 aos="fade-up">About us</h4>
    </div>
</div>

<script>
    $(window).scroll(function () {
        scroll = $(document).scrollTop();
        bai = 1 + scroll / $(document).height()
        $(".innerbanner img").css("transform", "scale(" + bai + ")")
    })
</script>

<div class="imgshowmask">
    <div class="imgshow" id="imgshow">
        <p><img src="" id="bigimg"> </p>
    </div>
</div>

<script>
    $(function () {
        $(".honor04 .box").click(function () {
            var src = $(this).find(".imgbox .con img").attr("src");
            $("#bigimg").attr("src", src);
            $(".imgshowmask").fadeIn();
        });
        $(document).mousedown(function (e) {
            if ($(e.target).parent(".imgshowmask").length == 0) {
                $(".imgshowmask").fadeOut(); //点击关闭按钮关闭暂停视频
            }
        })
    })
</script>

<div class="fx">
    <div class="com_nav">
        <div class="icenter3" aos="fade-up">
            <div class="le">
                荣誉资质
            </div>
            <div class="ri">
                <a href="/v1/about.html">公司简介</a>
                <a href="/v1/development.html">研发团队</a>
                <a class="active">荣誉资质</a>
                <a href="/v1/factory.html">生产保障</a>
            </div>
        </div>
    </div>

    <!-- honor01 -->
    <div class="honor01" aos="fade-up">
        <div class="icenter3">
            <h3 class="solu_h3">荣誉资质</h3>
            <ul>
                <li class="li2">
                    <a href="javascript:;">
                        <div class="text">
                            <h4>2022</h4>
                            <h5>
                                国家高新技术企业<br>
                                北京市专精特新<br>
                                通过ISO环境管理体系证
                            </h5>
                        </div>
                        <div class="pic">
                            <div class="img1"><img src="/static/v1/images/r1.png" alt=""> </div>
                            <div class="img2"><img src="/static/v1/images/r1b.png" alt=""> </div>
                        </div>
                    </a>
                </li>
                <li class="li1">
                    <a href="javascript:;">
                        <div class="text">
                            <h4>2021</h4>
                            <h5>
                                中关村高新企业 <br>
                                获中国腐蚀与防护学会科学技术一等奖 <br>
                                取得一种粉末冶金注射成型系统专利
                            </h5>
                        </div>
                        <div class="pic">
                        </div>
                    </a>
                </li>
                <li class="li1" style="width:100%;">
                    <a href="javascript:;">
                        <div class="text">
                            <h4>2020……</h4>
                            <h5>
                                起草电力行业标准 <br>
                                通过ISO质量管理体系证<br>
                                取得一种高性能粉末钢热喷射沉积成型工艺专利
                            </h5>
                        </div>
                        <div class="pic">
                        </div>
                    </a>
                </li>
            </ul>
        </div>
    </div>

    <!-- honor04 -->
    <div class="honor04">
        <div class="icenter2">
        </div>
        <div class="botF" aos="fade-up">
            <!-- 如果需要导航按钮 -->
            <div class="swiper-button-prev h04Swiper-button-prev fa fa-angle-left fa-dr"></div>
            <div class="swiper-button-next h04Swiper-button-next fa fa-angle-right fa-dr"></div>
            <div class="bot">
                <div class="icenter3">
                    <div class="swiper h04Swiper">
                        <div class="swiper-wrapper">
                            <div class="swiper-slide">
                                <div class="box">
                                    <div class="imgbox">
                                        <div class="con"><img
                                                src="/storage/20231211/44423be03e778fe4cb8ec8ec13da6f80.jpg">
                                        </div>
                                    </div>
                                    <h4>国家高新技术企业</h4>
                                </div>
                            </div>
                            <div class="swiper-slide">
                                <div class="box">
                                    <div class="imgbox">
                                        <div class="con"><img
                                                src="/storage/20231211/5ab5f105f906f6e4a24d2d83ac4b0550.jpg">
                                        </div>
                                    </div>
                                    <h4>中关村高新</h4>
                                </div>
                            </div>
                            <div class="swiper-slide">
                                <div class="box">
                                    <div class="imgbox">
                                        <div class="con"><img
                                                src="/storage/20231213/f6fe1efccfd5dbb64119675a8bb524c3.png">
                                        </div>
                                    </div>
                                    <h4>北京市专精特新</h4>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <script>
        var h04Swiper = new Swiper('.h04Swiper', {
            loop: true,
            slidesPerView: 3,
            // 如果需要前进后退按钮
            navigation: {
                nextEl: '.h04Swiper-button-next',
                prevEl: '.h04Swiper-button-prev',
            },
            spaceBetween: 74,
            //   autoplay: {
            //         delay: 3000,
            //         stopOnLastSlide: false,
            //         disableOnInteraction: false,
            //         },
            breakpoints: {
                768: {  //当屏幕宽度大于等于768 
                    slidesPerView: 1,
                    spaceBetween: 20
                },
                1600: {  //当屏幕宽度大于等于768 
                    slidesPerView: 3,
                    spaceBetween: 54
                },
                1280: {  //当屏幕宽度大于等于768 
                    slidesPerView: 3,
                    spaceBetween: 30
                },
            }
        })
    </script>

    <!-- honor02 -->
    <div class="honor02" aos="fade-up">
        <div class="imgbox"><img src="/static/v1/picture/20240130174923.jpg" alt=""></div>
        <div class="icenter3">
            <div class="wen">Innovative</div>
            <h3>创新成果</h3>
            <div class="bot">
                <ul class="honorCount">
                    <li>
                        <h4><strong class="honornum" data-startval="0" data-endval="100" data-speed="2"
                                data-decimals="0" id="honornum-1">100</strong><strong>+</strong></h4>
                        <div class="ri">
                            <h5>知识产权</h5>
                            <h6>拥有高性能功能材料相关知识产权xxx余项，涵盖了材料、设备、工艺及软件等。</h6>
                        </div>
                    </li>
                    <li>
                        <h4><strong class="honornum" data-startval="0" data-endval="10" data-speed="2" data-decimals="0"
                                id="honornum-2">10</strong><strong>+</strong></h4>
                        <div class="ri">
                            <h5>技术标准</h5>
                            <h6>制定国家、行业、团体等标准X余项</h6>
                        </div>
                    </li>
                    <li>
                        <h4><strong class="honornum" data-startval="0" data-endval="20" data-speed="2" data-decimals="0"
                                id="honornum-3">20</strong><strong>+</strong></h4>
                        <div class="ri">
                            <h5>创新奖项</h5>
                            <h6>获产品及科研创新等奖项X余项</h6>
                        </div>
                    </li>
                </ul>
            </div>
        </div>
    </div>
    <script>
        //关于我们
        var winH = $(window).height();
        var winW = $(window).width();
        var widScrollT = 0
        var c1 = 0;

        $(window).resize(function () {
            winH = $(window).height();
            winW = $(window).width();
            widScrollT = $(window).scrollTop();
        })

        //运动函数-滚动触发（元素起始位置，元素结束位置，运动起始位置，运动结束位置）
        var sMoveFun = function (oStart, oEnd, sStart, sEnd) {
            var ret;
            if (widScrollT >= sStart && widScrollT <= sEnd) {//运行过程中
                ret = oStart + (oEnd - oStart) / (sEnd - sStart) * (widScrollT - sStart)
            } else if (widScrollT < sStart) {//进入之前
                ret = oStart
            } else if (widScrollT > sEnd) {//离开之后
                ret = oEnd
            }
            return ret;
        }

        $(window).scroll(function () {

            widScrollT = $(window).scrollTop();
            var boxpart3_s = $(".honor02").offset().top - winH * 0.6
            if (widScrollT >= boxpart3_s) {
                if ($(window).width() < 1600) {
                    var boxpart3_t3 = sMoveFun(395, 846, boxpart3_s, boxpart3_s + winH * 1.2);
                } else {
                    var boxpart3_t3 = sMoveFun(565, 1200, boxpart3_s, boxpart3_s + winH * 1.2);
                }

                $(".honor02 .wen").css("left", boxpart3_t3 + "px");
            } else {
            }
        })


    </script>
    <!-- 数字滚动 -->
    <script type="text/javascript">
        $(function () {
            //主动拓展出来的功能
            // let cc_top = $(".index02").offset().top; 
            var countCXArr = [];
            var countCX = function () {
                // let sT1 =$(window).scrollTop();
                $('.honorCount').each(function (i, dom) {
                    //控制上下滑动数字的重置
                    // if(sT1>cc_top-100 || sT1 < 500){  countCXArr[i] = false;}
                    if (countCXArr[i] && countCXArr[i] === true) { return; }
                    var sT;
                    var ncTop;
                    sT = $(window).scrollTop();
                    ncTop = $(dom).offset().top;
                    var id, decimals, startVal, endVal, duration;

                    if ($(window).width() < 760) {
                        return
                    } else {
                        if (sT > ncTop - $(window).height() && sT < ncTop) {
                            $(dom).find('.honornum').each(function () {
                                id = $(this).attr('id');
                                decimals = $(this).attr('data-decimals'),
                                    startVal = $(this).attr('data-startVal'),
                                    endVal = $(this).attr('data-endVal'),
                                    duration = $(this).attr('data-speed');

                                new CountUp(id, startVal, endVal, decimals, duration, {
                                    useEasing: true,
                                    separator: ''
                                }).start();
                                countCXArr[i] = true;
                            })
                        }
                    }
                })
            }
            countCX();
            $(window).on("scroll", function () {
                countCX();
            })
        });
    </script>

    <div class="honor03">
        <div class="content">
            <div class="ban"><img src="/static/v1/style/img/quali-bg.png" alt=""></div>
            <div class="top" aos="fade-up">
                <a href="javascript:;" class="more more2 active">专利&商标</a>
                <a href="javascript:;" class="more more2">体系认证</a>
                <a href="javascript:;" class="more more2">创新奖项</a>
            </div>
            <div class="icenter3" aos="fade-up">
                <div class="_nav">
                    <div class="fa_nav fa_nav_1 active">
                        <div class="com_cc le_cc">
                            <div class="swiper-button-prev honor03_1Swiper-button-prev fa fa1"></div>
                            <div class="text">
                                <h4>PREVIOUS ITEM</h4>
                                <h5>技术资质1</h5>
                            </div>
                        </div>
                        <div class="com_cc ri_cc">
                            <div class="swiper-button-next honor03_1Swiper-button-next fa fa2"></div>
                            <div class="text">
                                <h4>NEXT ITEM</h4>
                                <h5>技术资质2</h5>
                            </div>
                        </div>
                    </div>
                    <div class="fa_nav fa_nav_2">
                        <div class="com_cc le_cc">
                            <div class="swiper-button-prev honor03_2Swiper-button-prev fa fa1"></div>
                            <div class="text">
                                <h4>PREVIOUS ITEM</h4>
                                <h5>技术资质1</h5>
                            </div>
                        </div>
                        <div class="com_cc ri_cc">
                            <div class="swiper-button-next honor03_2Swiper-button-next fa fa2"></div>
                            <div class="text">
                                <h4>Next ITEM</h4>
                                <h5>技术资质2</h5>
                            </div>
                        </div>
                    </div>
                    <div class="fa_nav fa_nav_3">
                        <div class="com_cc le_cc">
                            <div class="swiper-button-prev honor03_3Swiper-button-prev fa fa1"></div>
                            <div class="text">
                                <h4>PREVIOUS ITEM</h4>
                                <h5>技术资质1</h5>
                            </div>
                        </div>
                        <div class="com_cc ri_cc">
                            <div class="swiper-button-next honor03_3Swiper-button-next fa fa2"></div>
                            <div class="text">
                                <h4>Next ITEM</h4>
                                <h5>技术资质2</h5>
                            </div>
                        </div>
                    </div>
                </div>
                <!-- s_cc1 -->
                <div class="s_cc s_cc1 active">
                    <div class="swiper honor03Swiper honor03_1Swiper">
                        <div class="swiper-wrapper">
                            <div class="swiper-slide"><img
                                    src="/storage/20231213/d7a94f003434e8eb3fa5bf61a84e568e.jpg"><span
                                    class="cc">一种埋弧焊丝的制备方法</span></div>

                            <div class="swiper-slide"><img
                                    src="/storage/20231213/37b8999732f73c129ae7646ab3a7d66b.jpg"><span
                                    class="cc">一种粉末冶金注射成型系统</span></div>

                            <div class="swiper-slide"><img
                                    src="/storage/20231213/2eda7bfdcfb8b9b56e897e1ee3709324.jpg"><span
                                    class="cc">一种高强度耐磨不锈钢堆焊药芯焊丝及其应用</span></div>

                            <div class="swiper-slide"><img
                                    src="/storage/20231213/b9f204e0289d34c431d0238e44959123.jpg"><span
                                    class="cc">一种含氮化物热喷涂粉芯线材</span></div>

                            <div class="swiper-slide"><img
                                    src="/storage/20231213/afef0f7296edc1fbe9031d362a680a70.jpg"><span
                                    class="cc">一种高性能粉末钢热喷射沉积成型工艺</span></div>

                            <div class="swiper-slide"><img
                                    src="/storage/20231213/873c0bd04ef408331bb23966998c48cf.jpg"><span
                                    class="cc">CNS</span></div>

                            <div class="swiper-slide"><img
                                    src="/storage/20231213/2ebd83af6bb1c105b80eacefd7d0563c.jpg"><span
                                    class="cc">SAM</span></div>

                            <div class="swiper-slide"><img
                                    src="/storage/20231213/10d9fb34a6caec89f1c289f094ac5994.jpg"><span
                                    class="cc">SNM</span></div>

                            <div class="swiper-slide"><img
                                    src="/storage/20231213/f1f5228bf837df1b56a01d9b13842d00.jpg"><span
                                    class="cc">SOR</span></div>
                        </div>
                    </div>
                </div>
                <!-- s_cc2 -->
                <div class="s_cc s_cc2">
                    <div class="swiper honor03Swiper honor03_2Swiper">
                        <div class="swiper-wrapper">
                            <div class="swiper-slide"><img
                                    src="/storage/20231213/c68a4c7cf036a347b24c0061b3134778.jpg"><span
                                    class="cc">质量管理体系证书中文</span></div>
                            <div class="swiper-slide"><img
                                    src="/storage/20231213/d7c83f8b129d6886c9ff6d331b188b98.jpg"><span
                                    class="cc">质量管理体系证书英文</span></div>
                            <div class="swiper-slide"><img
                                    src="/storage/20231213/16c74d8720afab376ebf4d466bab0d3a.jpg"><span
                                    class="cc">环境管理体系中文</span></div>
                            <div class="swiper-slide"><img
                                    src="/storage/20231213/64a7e509881dae8400af87a97cc8f4ca.jpg"><span
                                    class="cc">环境管理体系英文</span></div>
                            <div class="swiper-slide"><img
                                    src="/storage/20231213/05599276fc3ec6c4b18f97a25dee8838.jpg"><span
                                    class="cc">职业健康安全管理体系中文</span></div>
                            <div class="swiper-slide"><img
                                    src="/storage/20231213/8f8983bf2d804b2e610fa5809e4f93ba.jpg"><span
                                    class="cc">职业健康安全管理体系英文</span></div>
                        </div>
                    </div>
                </div>
                <!-- s_cc3 -->
                <div class="s_cc s_cc3">
                    <div class="swiper honor03Swiper honor03_3Swiper">
                        <div class="swiper-wrapper">
                            <div class="swiper-slide"><img
                                    src="http://localhost:8003/storage/20231213/ed31d06720938168aa2e4b0c28a31670.jpg"><span
                                    class="cc">一等奖获奖证书 燃用高硫煤锅炉水冷壁高温腐蚀综合治理研究及工程应用</span></div>
                            <div class="swiper-slide"><img
                                    src="http://localhost:8003/storage/20231213/9a930f9b23992821bc1ba58e7440f85e.jpg"><span
                                    class="cc">北京赛亿 电力行业标准 荣誉证书</span></div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <script>
        $(".honor03 .top a").click(function () {
            $(this).addClass("active").siblings().removeClass("active")
            let dex = $(this).index()
            switch (dex) {
                case 0:
                    $(".honor03 .icenter3 .s_cc1").addClass("active").siblings().removeClass("active")
                    $(".fa_nav_1").addClass("active").siblings().removeClass("active")
                    honor03_1Swiper.slideTo(2, 0, false);
                    honor03_1Swiper.autoplay.stop();
                    honor03_1Swiper.autoplay.start();

                    setTimeout(() => {
                        $('.honor03 .fa_nav_1 .ri_cc .text h5').html($(".honor03_1Swiper .swiper-slide-next .cc").html())
                        $('.honor03 .fa_nav_1 .le_cc .text h5').html($(".honor03_1Swiper .swiper-slide-prev .cc").html())
                    }, 100);

                    break;
                case 1:

                    $(".honor03 .icenter3 .s_cc2").addClass("active").siblings().removeClass("active")
                    $(".fa_nav_2").addClass("active").siblings().removeClass("active")
                    honor03_2Swiper.slideTo(2, 0, false);
                    honor03_2Swiper.autoplay.stop();
                    honor03_2Swiper.autoplay.start();

                    setTimeout(() => {
                        $('.honor03 .fa_nav_2 .ri_cc .text h5').html($(".honor03_2Swiper .swiper-slide-next .cc").html())
                        $('.honor03 .fa_nav_2 .le_cc .text h5').html($(".honor03_2Swiper .swiper-slide-prev .cc").html())
                    }, 100);


                    break;
                case 2:

                    $(".honor03 .icenter3 .s_cc3").addClass("active").siblings().removeClass("active")
                    $(".fa_nav_3").addClass("active").siblings().removeClass("active")
                    honor03_3Swiper.slideTo(2, 0, false);
                    honor03_3Swiper.autoplay.stop();
                    honor03_3Swiper.autoplay.start();

                    setTimeout(() => {
                        $('.honor03 .fa_nav_3 .ri_cc .text h5').html($(".honor03_3Swiper .swiper-slide-next .cc").html())
                        $('.honor03 .fa_nav_3 .le_cc .text h5').html($(".honor03_3Swiper .swiper-slide-prev .cc").html())
                    }, 100);

                    break;

            }
        })


        // honore03_1swiper
        var honor03_1Swiper = new Swiper('.honor03_1Swiper', {
            autoplay: {
                speed: 3000,
                disableOnInteraction: false,
            },
            observer: true,
            observeParents: true,
            resizeObserver: true,
            observeSlideChildren: true,
            loop: true, // 循环模式选项
            slidesPerView: 5,
            centeredSlides: true,
            spaceBetween: -95,
            // 如果需要前进后退按钮
            navigation: {
                nextEl: '.honor03_1Swiper-button-next',
                prevEl: '.honor03_1Swiper-button-prev',
            },
            on: {
                slideChangeTransitionStart: function () {
                    $('.honor03 .fa_nav_1 .ri_cc .text h5').html($(".honor03_1Swiper .swiper-slide-next .cc").html())
                    $('.honor03 .fa_nav_1 .le_cc .text h5').html($(".honor03_1Swiper .swiper-slide-prev .cc").html())
                },

            },
            breakpoints: {
                1600: {
                    spaceBetween: -120,
                },
                760: {  //当屏幕宽度大于等于320
                    slidesPerView: 3,
                    spaceBetween: -63
                },
            }
        })
        $(".honor03 .fa_nav_1 .le_cc").click(function () {
            honor03_1Swiper.slidePrev();
        })
        $(".honor03 .fa_nav_1 .ri_cc").click(function () {
            honor03_1Swiper.slideNext();
        })


        // honore03_2Swiper
        var honor03_2Swiper = new Swiper('.honor03_2Swiper', {
            autoplay: {
                speed: 3000,
                disableOnInteraction: false,
            },
            observer: true,
            observeParents: true,
            resizeObserver: true,
            observeSlideChildren: true,
            loop: true, // 循环模式选项
            slidesPerView: 5,
            centeredSlides: true,
            spaceBetween: -95,
            // 如果需要前进后退按钮
            navigation: {
                nextEl: '.honor03_2Swiper-button-next',
                prevEl: '.honor03_2Swiper-button-prev',
            },
            on: {
                slideChangeTransitionStart: function () {
                    $('.honor03 .fa_nav_2 .ri_cc .text h5').html($(".honor03_2Swiper .swiper-slide-next .cc").html())
                    $('.honor03 .fa_nav_2 .le_cc .text h5').html($(".honor03_2Swiper .swiper-slide-prev .cc").html())
                },

            },
            breakpoints: {
                1600: {
                    spaceBetween: -120,
                },
                760: {  //当屏幕宽度大于等于320
                    slidesPerView: 3,
                    spaceBetween: -63
                },
            }
        })
        $(".honor03 .fa_nav_2 .le_cc").click(function () {
            honor03_2Swiper.slidePrev();
        })
        $(".honor03 .fa_nav_2 .ri_cc").click(function () {
            honor03_2Swiper.slideNext();
        })


        // honore03_3Swiper
        var honor03_3Swiper = new Swiper('.honor03_3Swiper', {
            autoplay: {
                speed: 3000,
                disableOnInteraction: false,
            },
            observer: true,
            observeParents: true,
            resizeObserver: true,
            observeSlideChildren: true,
            loop: true, // 循环模式选项
            slidesPerView: 5,
            centeredSlides: true,
            spaceBetween: -95,
            // 如果需要前进后退按钮
            navigation: {
                nextEl: '.honor03_3Swiper-button-next',
                prevEl: '.honor03_3Swiper-button-prev',
            },
            on: {
                slideChangeTransitionStart: function () {
                    $('.honor03 .fa_nav_3 .ri_cc .text h5').html($(".honor03_3Swiper .swiper-slide-next .cc").html())
                    $('.honor03 .fa_nav_3 .le_cc .text h5').html($(".honor03_3Swiper .swiper-slide-prev .cc").html())
                },

            },
            breakpoints: {
                1600: {
                    spaceBetween: -120,
                },
                760: {  //当屏幕宽度大于等于320
                    slidesPerView: 3,
                    spaceBetween: -63
                },
            }
        })
        $(".honor03 .fa_nav_3 .le_cc").click(function () {
            honor03_3Swiper.slidePrev();
        })
        $(".honor03 .fa_nav_3 .ri_cc").click(function () {
            honor03_3Swiper.slideNext();
        })
    </script>
</div>